<script>


      export default {
        name: "MyAside",
        data(){
          return {
            //  isCollapse:false

          /*  menu:[
                {
                  menuClick:'MyAdmin',
                  menuName:'管理员管理',
                  menuIcon:'el-icon-s-custom'
                },{
                  menuClick:'MyUser',
                  menuName:'用户管理',
                  menuIcon:'el-icon-user-solid'
                }
            ]*/
           }
        },
        computed:{
          "menu":{
            get(){
              return this.$store.state.menu
            }
          }
        },
        props:{
          isCollapse:Boolean
        },
        methods: {

          handleClick(route) {
            this.$router.push(route);
          },
        }
      }
</script>

<template>

  <el-menu
        background-color="#302d2d"
        text-color="#fff"
        active-text-color="#ffd04b"
        style="height: 100vh;"
        default-active="/MyHome"
        :collapse="isCollapse"
        :collapse-transition="false">
        router
        unique-opened

      <el-menu-item index="/MyHome" @click="handleClick('/MyHome')">
        <i class="el-icon-s-home"></i>
        <span slot="title">首页</span>
      </el-menu-item>

      <el-menu-item :index="item.menuclick" v-for="(item,i) in menu" :key="i" @click="handleClick(item.menuclick)" >
      <i :class="item.menuicon"></i>
      <span slot="title">{{ item.menuname }}</span>
      </el-menu-item>


  </el-menu>
</template>

<style scoped>
.el-menu-item [class^=el-icon-] {
  margin-right: 5px;
  width: 24px;
  text-align: center;
  font-size: 18px;
  vertical-align: middle;

}
</style>